<style>
    #insert-node > p {

    }
</style>
<div id="insert-node">

</div>
<div id="loading-div">
    <p tag="<%= tag %>" action="<%= action %>" id="loading"><img id="loading-img" src="/images/loading.gif" alt="加载中"> 正在加载中...</p>
</div>
<script src="https://cdn.bootcss.com/socket.io/2.0.2/socket.io.js"></script>
<script language="JavaScript">
    $(function(){
        var tag = $("#loading").attr('tag');
        var action = $('#loading').attr('action');

        <% var url = baseUrl;url = url.split('://')[0] + '://' + (url.split('://')[1]).split(':')[0]; %>

        var socket = io.connect("<%=url %>:8081");
        socket.on('connect', function () {
            console.log('准备获取数据');
        });
        socket.on('data',function (data) {
            if (data.tag === tag && data.action === action) {
                if (data.data) {
                    if (data.data.message === 'ipack') {
                        $("#loading").text('任务完成');
                        $("#loading-img").hide();
                        socket.disconnect();
                    } else {
                        insertNode(data.data.message);
                    }
                } else  {
                    if (data.error.message === 'ipack') {
                        $("#loading").text('任务失败');
                        $("#loading-img").hide();
                        socket.disconnect();
                    } else {
                        insertNode(JSON.stringify(data.error));
                    }
                }
            }
//            console.log('data ' + JSON.stringify(data));
        });
        socket.on('disconnect',function () {
            socket.disconnect();
        })

    });
    function insertNode(message) {
        var nameNode = document.createElement('p');
        nameNode.innerText = message;
        var parent = document.getElementById('insert-node');
        parent.appendChild(nameNode);
        var h = $(document).height()-$(window).height();
        $(document).scrollTop(h);

    }
</script>